<template>
    <div class="container">
        <van-search v-model="searchData.searchText" placeholder="请输入访客手机号/证件号码/车牌号信息进行核验" autocomplete="off"
            shape="round" background="#4fc08d" left-icon="">
            <template #right-icon>
                <van-button type="primary" round color="#2d5fff" :icon="imgSrc" size="mini"
                    @click.stop.prevent="HY"></van-button>
            </template>
        </van-search>
        <van-button type="primary" round>测试按钮</van-button>
    </div>
</template>

<script setup>
import { reactive,ref } from "vue";
let searchData = ref({
    searchText: ''
});

let imgSrc = ref('https://fastly.jsdelivr.net/npm/@vant/assets/user-active.png')
const HY = () => {
    console.log('搜索  --- ' + searchData.value.searchText);
}
// export default {
//     data() {
//         return {
//             searchData: {
//                 searchText: ''
//             },
//             imgSrc: 'https://fastly.jsdelivr.net/npm/@vant/assets/user-active.png'
//         };
//     },

//     methods: {
//         HY() {
//             console.log('搜索  --- ' + this.searchData.searchText);
//         }
//     },
// };
</script>

<style lang="css">
.container .van-field__right-icon {
    display: flex;
    align-items: center;
    justify-content: center;
}
</style>
